import React from 'react';
import { connect } from 'dva';
import ReactEcharts from 'echarts-for-react';


function LineMarkerEcharts ({dataArr,xData,dataArr1,dataArr2,dataArr3,dataArr4,dataArr5,dataArr6,dataArr7}){

    var colorArr = ['#1890ff', '#2fc25b', '#facc14', '#223273', '#8543e0', '#13c2c2', '#3436c7', '#f04864'];
    console.log(dataArr)
  
var arr = new Array(1000)

var i = arr.length

while(i--){arr[i] = i}

    var echartsOption = {
      title: {
          text: '数据波形图'
      },
      tooltip: {
          trigger: 'item'
      },
      legend: { 
          data:['曲线','曲线1','曲线2','曲线3','曲线4','曲线5','曲线6','曲线7',],
          width:800,
          height:700
      },
      color: colorArr,
      grid: {
          left: '3%',
          right: '4%',
          bottom: '3%',
          containLabel: true
      },
      toolbox: {
          feature: {
            dataView : {show: true, readOnly: false},
            // magicType : {show: true, type: ['line', 'bar']},
            saveAsImage: {} //存取为图片
          }
      },
    
      xAxis: {
        type: 'category',
        boundaryGap: false,
        data: arr
      },
      yAxis: {
          type: 'value',
          min:-0.13,
          max:0.04
      },
      dataZoom: [
        {
            type: 'slider',
            show: true,
            start: 0,
            end: 1,
            handleSize: 1
        
        },
    ],
    //   series: [
    //       {
    //           name:'天海湾',
    //           type:'line',
    //           stack: '总量',
    //           data:[120, 132, 101, 134, 90, 230, 210]
    //       },
  
    series: [
              {
                  name:'曲线',
                  type:'line',
                  stack: '总量',
                  data:dataArr,
                  smooth: true
              },
              
              {
                name:'曲线1',
                type:'line',
                stack: '总量',
                data:dataArr1,
                smooth: true
            },
            
            {
                name:'曲线2',
                type:'line',
                stack: '总量',
                data:dataArr2,
                smooth: true
            },
            {
                name:'曲线3',
                type:'line',
                stack: '总量',
                data:dataArr3,
                smooth: true
            },
            {
                name:'曲线4',
                type:'line',
                stack: '总量',
                data:dataArr4,
                smooth: true
            },
            {
                name:'曲线5',
                type:'line',
                stack: '总量',
                data:dataArr5,
                smooth: true
            },
            {
                name:'曲线6',
                type:'line',
                stack: '总量',
                data:dataArr6,
                smooth: true
            },
            {
                name:'曲线7',
                type:'line',
                stack: '总量',
                data:dataArr7,
                smooth: true
            },
    ]

    };
    console.log(echartsOption.series)
    
 return (
  <ReactEcharts
    // ref={(e) => { this.echartsElement = e }}

    style={{height:700}}
     option={echartsOption}
     theme="clear"
    />
 )
 }
// export default LineMarkerEcharts;
export default connect(({ echart }) => ({ ...echart }))(LineMarkerEcharts)